<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8" />
	<meta name="viewport" content="width=device-width, initial-scale=1.0">

	<title>SuperheroAdmin - Bootstrap Admin Template</title>
	
	<!-- bootstrap -->
	<link href="css/bootstrap/bootstrap.css" rel="stylesheet" />

	<!-- libraries -->
	<link href="css/libs/font-awesome.css" type="text/css" rel="stylesheet" />

	<!-- global styles -->
	<link rel="stylesheet" type="text/css" href="css/compiled/layout.css">
	<link rel="stylesheet" type="text/css" href="css/compiled/elements.css">

	<!-- this page specific styles -->
	<link rel="stylesheet" href="css/libs/daterangepicker.css" type="text/css" />

	<!-- google font libraries -->
	<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,600,700,300|Titillium+Web:200,300,400' rel='stylesheet' type='text/css'>

	<!--[if lt IE 9]>
		<script src="js/html5shiv.js"></script>
		<script src="js/respond.min.js"></script>
	<![endif]-->
	<!--[if lt IE 8]>
		<link href="css/libs/font-awesome-ie7.css" type="text/css" rel="stylesheet" />
	<![endif]-->
</head>
<body>
	<header class="navbar" id="header-navbar">
		<div class="container">
			<a href="index.html" id="logo" class="navbar-brand col-md-3 col-sm-4 col-xs-12">
				<img src="img/logo.png" alt=""/> SuperheroAdmin
			</a>
			
			<button class="navbar-toggle" data-target=".navbar-ex1-collapse" data-toggle="collapse" type="button">
				<span class="sr-only">Toggle navigation</span>
				<span class="fa fa-bars"></span>
			</button>
			
			<div class="nav-no-collapse pull-right" id="header-nav">
				<ul class="nav navbar-nav pull-right">
					<li class="mobile-search">
						<a class="btn">
							<i class="fa fa-search"></i>
						</a>
						
						<div class="drowdown-search">
							<form role="search">
								<div class="form-group">
									<input type="text" class="form-control" placeholder="Search...">
									<i class="fa fa-search nav-search-icon"></i>
								</div>
							</form>
						</div>
						
					</li>
					<li class="dropdown hidden-xs">
						<a class="btn dropdown-toggle" data-toggle="dropdown">
							<i class="fa fa-warning"></i>
							<span class="count">8</span>
						</a>
						<ul class="dropdown-menu notifications-list">
							<li class="pointer">
								<div class="pointer-inner">
									<div class="arrow"></div>
									<div class="arrow-border"></div>
								</div>
							</li>
							<li class="item-header">You have 6 new notifications</li>
							<li class="item">
								<a href="#">
									<i class="fa fa-comment"></i>
									<span class="content">New comment on ‘Awesome P...</span>
									<span class="time"><i class="fa fa-clock-o"></i>13 min.</span>
								</a>
							</li>
							<li class="item">
								<a href="#">
									<i class="fa fa-plus"></i>
									<span class="content">New user registration</span>
									<span class="time"><i class="fa fa-clock-o"></i>13 min.</span>
								</a>
							</li>
							<li class="item">
								<a href="#">
									<i class="fa fa-envelope"></i>
									<span class="content">New Message from George</span>
									<span class="time"><i class="fa fa-clock-o"></i>13 min.</span>
								</a>
							</li>
							<li class="item">
								<a href="#">
									<i class="fa fa-shopping-cart"></i>
									<span class="content">New purchase</span>
									<span class="time"><i class="fa fa-clock-o"></i>13 min.</span>
								</a>
							</li>
							<li class="item">
								<a href="#">
									<i class="fa fa-eye"></i>
									<span class="content">New order</span>
									<span class="time"><i class="fa fa-clock-o"></i>13 min.</span>
								</a>
							</li>
							<li class="item-footer">
								<a href="#">
									View all notifications
								</a>
							</li>
						</ul>
					</li>
					<li class="dropdown hidden-xs">
						<a class="btn dropdown-toggle" data-toggle="dropdown">
							<i class="fa fa-envelope-o"></i>
							<span class="count">16</span>
						</a>
						<ul class="dropdown-menu notifications-list messages-list">
							<li class="pointer">
								<div class="pointer-inner">
									<div class="arrow"></div>
									<div class="arrow-border"></div>
								</div>
							</li>
							<li class="item first-item">
								<a href="#">
									<img src="img/samples/messages-photo-1.png" alt=""/>
									<span class="content">
										<span class="content-headline">
											George Clooney
										</span>
										<span class="content-text">
											Look, just because I don't be givin' no man a foot massage don't make it 
											right for Marsellus to throw...
										</span>
									</span>
									<span class="time"><i class="fa fa-clock-o"></i>13 min.</span>
								</a>
							</li>
							<li class="item">
								<a href="#">
									<img src="img/samples/messages-photo-2.png" alt=""/>
									<span class="content">
										<span class="content-headline">
											Emma Watson
										</span>
										<span class="content-text">
											Look, just because I don't be givin' no man a foot massage don't make it 
											right for Marsellus to throw...
										</span>
									</span>
									<span class="time"><i class="fa fa-clock-o"></i>13 min.</span>
								</a>
							</li>
							<li class="item">
								<a href="#">
									<img src="img/samples/messages-photo-3.png" alt=""/>
									<span class="content">
										<span class="content-headline">
											Robert Downey Jr.
										</span>
										<span class="content-text">
											Look, just because I don't be givin' no man a foot massage don't make it 
											right for Marsellus to throw...
										</span>
									</span>
									<span class="time"><i class="fa fa-clock-o"></i>13 min.</span>
								</a>
							</li>
							<li class="item-footer">
								<a href="#">
									View all messages
								</a>
							</li>
						</ul>
					</li>
					<li class="hidden-xs">
						<a class="btn">
							<i class="fa fa-cog"></i>
						</a>
					</li>
					<li class="dropdown profile-dropdown">
						<a href="#" class="dropdown-toggle" data-toggle="dropdown">
							<img src="img/samples/profile-photo.png" alt=""/>
							<span class="hidden-xs">Scarlett Johansson</span> <b class="caret"></b>
						</a>
						<ul class="dropdown-menu">
							<li><a href="user-profile.html"><i class="fa fa-user"></i>Profile</a></li>
							<li><a href="#"><i class="fa fa-cog"></i>Settings</a></li>
							<li><a href="#"><i class="fa fa-envelope-o"></i>Messages</a></li>
							<li><a href="#"><i class="fa fa-power-off"></i>Logout</a></li>
						</ul>
					</li>
					<li class="hidden-xxs">
						<a class="btn">
							<i class="fa fa-power-off"></i>
						</a>
					</li>
				</ul>
			</div>
		</div>
	</header>
	<div class="container">
		<div class="row">
			<div class="col-md-2" id="nav-col">
				<section id="col-left">
					<div class="collapse navbar-collapse navbar-ex1-collapse" id="sidebar-nav">	
						<ul class="nav nav-pills nav-stacked">
							<li>
								<a href="index.html">
									<i class="fa fa-dashboard"></i>
									<span>Dashboard</span>
								</a>
							</li>
							<li>
								<a href="#" class="dropdown-toggle">
									<i class="fa fa-bar-chart-o"></i>
									<span>Graphs</span>
									<i class="fa fa-chevron-circle-down drop-icon"></i>
								</a>
								<ul class="submenu">
									<li>
										<a href="graphs-xcharts.html">
											xCharts
										</a>
									</li>
									<li>
										<a href="graphs-flot.html">
											Flot
										</a>
									</li>
									<li>
										<a href="graphs-morris.html">
											Morris &amp; Mixed
										</a>
									</li>
								</ul>
							</li>
							<li>
								<a href="#" class="dropdown-toggle">
									<i class="fa fa-users"></i>
									<span>Users</span>
									<i class="fa fa-chevron-circle-down drop-icon"></i>
								</a>
								<ul class="submenu">
									<li>
										<a href="users.html">
											User list
										</a>
									</li>
									<li>
										<a href="user-profile.html">
											User profile
										</a>
									</li>
								</ul>
							</li>
							<li>
								<a href="#" class="dropdown-toggle">
									<i class="fa fa-edit"></i>
									<span>Forms</span>
									<i class="fa fa-chevron-circle-down drop-icon"></i>
								</a>
								<ul class="submenu">
									<li>
										<a href="form-elements.html">
											Form elements
										</a>
									</li>
									<li>
										<a href="form-wizard.html">
											Form wizard
										</a>
									</li>
									<li>
										<a href="form-wizard-popup.html">
											Form wizard popup
										</a>
									</li>
									<li>
										<a href="form-wysiwyg.html">
											WYSIWYG
										</a>
									</li>
									<li>
										<a href="form-ckeditor.html">
											WYSIWYG CKEditor
										</a>
									</li>
									<li>
										<a href="form-dropzone.html">
											Drop File Upload
										</a>
									</li>
								</ul>
							</li>
							<li class="active">
								<a href="tables.html">
									<i class="fa fa-table"></i>
									<span>Tables</span>
								</a>
							</li>
							<li>
								<a href="typography.html">
									<i class="fa fa-font"></i>
									<span>Typography</span>
								</a>
							</li>
							<li>
								<a href="calendar.html">
									<i class="fa fa-calendar"></i>
									<span>Calendar</span>
								</a>
							</li>
							<li>
								<a href="#" class="dropdown-toggle">
									<i class="fa fa-star"></i>
									<span>Icons</span>
									<i class="fa fa-chevron-circle-down drop-icon"></i>
								</a>
								<ul class="submenu">
									<li>
										<a href="icons-awesome.html">
											Awesome Icons
										</a>
									</li>
									<li>
										<a href="icons-halflings.html">
											Halflings
										</a>
									</li>
								</ul>
							</li>
							<li>
								<a href="#" class="dropdown-toggle">
									<i class="fa fa-desktop"></i>
									<span>UI Elements</span>
									<i class="fa fa-chevron-circle-down drop-icon"></i>
								</a>
								<ul class="submenu">
									<li>
										<a href="ui-elements.html">
											Elements
										</a>
									</li>
									<li>
										<a href="ui-nestable.html">
											Nestable
										</a>
									</li>
								</ul>
							</li>
							<li>
								<a href="gallery.html">
									<i class="fa fa-picture-o"></i>
									<span>Gallery</span>
								</a>
							</li>
							<li>
								<a href="#" class="dropdown-toggle">
									<i class="fa fa-folder-open"></i>
									<span>3 Level Menu</span>
									<i class="fa fa-chevron-circle-down drop-icon"></i>
								</a>
								<ul class="submenu">
									<li>
										<a href="#" class="dropdown-toggle">
											2nd Level
											<i class="fa fa-chevron-circle-down drop-icon"></i>
										</a>
										<ul class="submenu">
											<li>
												<a href="#">
													3rd Level
												</a>
											</li>
											<li>
												<a href="#">
													3rd Level
												</a>
											</li>
											<li>
												<a href="#">
													3rd Level
												</a>
											</li>
										</ul>
									</li>
									<li>
										<a href="#" class="dropdown-toggle">
											2nd Level
											<i class="fa fa-chevron-circle-down drop-icon"></i>
										</a>
										<ul class="submenu">
											<li>
												<a href="#">
													3rd Level
												</a>
											</li>
											<li>
												<a href="#">
													3rd Level
												</a>
											</li>
											<li>
												<a href="#">
													3rd Level
												</a>
											</li>
										</ul>
									</li>
									<li>
										<a href="#">
											2nd Level
										</a>
									</li>
								</ul>
							</li>
							<li>
								<a href="#" class="dropdown-toggle">
									<i class="fa fa-file-text-o"></i>
									<span>Extra pages</span>
									<i class="fa fa-chevron-circle-down drop-icon"></i>
								</a>
								<ul class="submenu">
									<li>
										<a href="pricing.html">
											Pricing
										</a>
									</li>
									<li>
										<a href="login.html">
											Login
										</a>
									</li>
									<li>
										<a href="login-full.html">
											Login full
										</a>
									</li>
									<li>
										<a href="invoice.html">
											Invoice
										</a>
									</li>
									<li>
										<a href="emails.html">
											Emails
										</a>
									</li>
									<li>
										<a href="faq.html">
											FAQ
										</a>
									</li>
									<li>
										<a href="error-404.html">
											Error 404
										</a>
									</li>
									<li>
										<a href="error-404-v2.html">
											Error 404 Nested
										</a>
									</li>
									<li>
										<a href="error-500.html">
											Error 500
										</a>
									</li>
									<li>
										<a href="extra-grid.html">
											Grid
										</a>
									</li>
								</ul>
							</li>
						</ul>
					</div>
				</section>
			</div>
			<div class="col-md-10 col-sm-11" id="content-wrapper">
				<div class="row">
					<div class="col-lg-12">
						
						<h1>Tables <small>Secondary headline</small></h1>
						
						<div class="row">
							<div class="col-lg-12">
								<div class="main-box clearfix">
									<div class="clearfix">
										<h2 class="pull-left">Orders</h2>
										
										<div id="reportrange" class="pull-right daterange-filter">
											<i class="icon-calendar"></i>
											<span></span> <b class="caret"></b>
										</div>
									</div>

									<div class="table-responsive">
										<table class="table">
											<thead>
												<tr>
													<th><a href="#"><span>Order ID</span></a></th>
													<th><a href="#" class="desc"><span>Date</span></a></th>
													<th><a href="#" class="asc"><span>Customer</span></a></th>
													<th class="text-center"><span>Status</span></th>
													<th class="text-right"><span>Price</span></th>
												</tr>
											</thead>
											<tbody>
												<tr>
													<td>
														<a href="#">#8002</a>
													</td>
													<td>
														2013/08/08
													</td>
													<td>
														<a href="#">Robert De Niro</a>
													</td>
													<td class="text-center">
														<span class="label label-success">Completed</span>
													</td>
													<td class="text-right">
														&dollar; 825.50
													</td>
												</tr>
												<tr>
													<td>
														<a href="#">#5832</a>
													</td>
													<td>
														2013/08/08
													</td>
													<td>
														<a href="#">John Wayne</a>
													</td>
													<td class="text-center">
														<span class="label label-warning">On hold</span>
													</td>
													<td class="text-right">
														&dollar; 923.93
													</td>
												</tr>
												<tr>
													<td>
														<a href="#">#2547</a>
													</td>
													<td>
														2013/08/08
													</td>
													<td>
														<a href="#">Anthony Hopkins</a>
													</td>
													<td class="text-center">
														<span class="label label-primary">Pending</span>
													</td>
													<td class="text-right">
														&dollar; 1.625.50
													</td>
												</tr>
												<tr>
													<td>
														<a href="#">#9274</a>
													</td>
													<td>
														2013/08/08
													</td>
													<td>
														<a href="#">Charles Chaplin</a>
													</td>
													<td class="text-center">
														<span class="label label-danger">Cancelled</span>
													</td>
													<td class="text-right">
														&dollar; 35.34
													</td>
												</tr>
												<tr>
													<td>
														<a href="#">#8463</a>
													</td>
													<td>
														2013/08/08
													</td>
													<td>
														<a href="#">Gary Cooper</a>
													</td>
													<td class="text-center">
														<span class="label label-success">Completed</span>
													</td>
													<td class="text-right">
														&dollar; 34.199.99
													</td>
												</tr>
											</tbody>
										</table>
									</div>
									<ul class="pagination pull-right">
										<li><a href="#"><i class="fa fa-chevron-left"></i></a></li>
										<li><a href="#">1</a></li>
										<li><a href="#">2</a></li>
										<li><a href="#">3</a></li>
										<li><a href="#">4</a></li>
										<li><a href="#">5</a></li>
										<li><a href="#"><i class="fa fa-chevron-right"></i></a></li>
									</ul>
								</div>
							</div>
						</div>
						
						<div class="row">
							<div class="col-lg-12">
								<div class="main-box clearfix">
									<div class="clearfix">
										<h2 class="pull-left">Products</h2>
										
										<div class="filter-block pull-right">
											<div class="form-group pull-left">
												<input type="text" class="form-control" placeholder="Search...">
												<i class="fa fa-search search-icon"></i>
											</div>
											
											<a href="#" class="btn btn-primary pull-right">
												<i class="fa fa-plus-circle fa-lg"></i> Add product
											</a>
										</div>
									</div>
									
									<div class="table-responsive">
										<table class="table">
											<thead>
												<tr>
													<th><a href="#"><span>Product</span></a></th>
													<th class="text-right"><a href="#" class="asc"><span>Price</span></a></th>
													<th class="text-center"><span>Status</span></th>
													<th class="text-center"><a href="#" class="desc"><span>Date updated</span></a></th>
													<th>&nbsp;</th>
												</tr>
											</thead>
											<tbody>
												<tr>
													<td>
														iPad Mini 32GB Wifi
													</td>
													<td class="text-right">
														&dollar; 625.50
													</td>
													<td class="text-center">
														<span class="label label-warning">Inactive</span>
													</td>
													<td class="text-center">
														2013/08/08 12:08
													</td>
													<td style="width: 15%;">
														<a href="#" class="table-link">
															<span class="fa-stack">
																<i class="fa fa-square fa-stack-2x"></i>
																<i class="fa fa-search-plus fa-stack-1x fa-inverse"></i>
															</span>
														</a>
														<a href="#" class="table-link">
															<span class="fa-stack">
																<i class="fa fa-square fa-stack-2x"></i>
																<i class="fa fa-pencil fa-stack-1x fa-inverse"></i>
															</span>
														</a>
														<a href="#" class="table-link danger">
															<span class="fa-stack">
																<i class="fa fa-square fa-stack-2x"></i>
																<i class="fa fa-trash-o fa-stack-1x fa-inverse"></i>
															</span>
														</a>
													</td>
												</tr>
												<tr>
													<td>
														MacBook Air 11"
													</td>
													<td class="text-right">
														&dollar; 999.00
													</td>
													<td class="text-center">
														<span class="label label-success">Active</span>
													</td>
													<td class="text-center">
														2013/08/08 12:08
													</td>
													<td style="width: 15%;">
														<a href="#" class="table-link">
															<span class="fa-stack">
																<i class="fa fa-square fa-stack-2x"></i>
																<i class="fa fa-search-plus fa-stack-1x fa-inverse"></i>
															</span>
														</a>
														<a href="#" class="table-link">
															<span class="fa-stack">
																<i class="fa fa-square fa-stack-2x"></i>
																<i class="fa fa-pencil fa-stack-1x fa-inverse"></i>
															</span>
														</a>
														<a href="#" class="table-link danger">
															<span class="fa-stack">
																<i class="fa fa-square fa-stack-2x"></i>
																<i class="fa fa-trash-o fa-stack-1x fa-inverse"></i>
															</span>
														</a>
													</td>
												</tr>
												<tr>
													<td>
														iPad 128GB Wifi+3G
													</td>
													<td class="text-right">
														&dollar; 1825.00
													</td>
													<td class="text-center">
														<span class="label label-success">Active</span>
													</td>
													<td class="text-center">
														2013/08/08 12:08
													</td>
													<td style="width: 15%;">
														<a href="#" class="table-link">
															<span class="fa-stack">
																<i class="fa fa-square fa-stack-2x"></i>
																<i class="fa fa-search-plus fa-stack-1x fa-inverse"></i>
															</span>
														</a>
														<a href="#" class="table-link">
															<span class="fa-stack">
																<i class="fa fa-square fa-stack-2x"></i>
																<i class="fa fa-pencil fa-stack-1x fa-inverse"></i>
															</span>
														</a>
														<a href="#" class="table-link danger">
															<span class="fa-stack">
																<i class="fa fa-square fa-stack-2x"></i>
																<i class="fa fa-trash-o fa-stack-1x fa-inverse"></i>
															</span>
														</a>
													</td>
												</tr>
												<tr>
													<td>
														iMac 27" Quad Core i5 3.2GHz
													</td>
													<td class="text-right">
														&dollar; 1.920.50
													</td>
													<td class="text-center">
														<span class="label label-success">Active</span>
													</td>
													<td class="text-center">
														2013/08/08 12:08
													</td>
													<td style="width: 15%;">
														<a href="#" class="table-link">
															<span class="fa-stack">
																<i class="fa fa-square fa-stack-2x"></i>
																<i class="fa fa-search-plus fa-stack-1x fa-inverse"></i>
															</span>
														</a>
														<a href="#" class="table-link">
															<span class="fa-stack">
																<i class="fa fa-square fa-stack-2x"></i>
																<i class="fa fa-pencil fa-stack-1x fa-inverse"></i>
															</span>
														</a>
														<a href="#" class="table-link danger">
															<span class="fa-stack">
																<i class="fa fa-square fa-stack-2x"></i>
																<i class="fa fa-trash-o fa-stack-1x fa-inverse"></i>
															</span>
														</a>
													</td>
												</tr>
												<tr>
													<td>
														Mac Pro 2.8GHz 4-Core Intel Xeon 
													</td>
													<td class="text-right">
														&dollar; 4.625.50
													</td>
													<td class="text-center">
														<span class="label label-warning">Inactive</span>
													</td>
													<td class="text-center">
														2013/08/08 12:08
													</td>
													<td style="width: 15%;">
														<a href="#" class="table-link">
															<span class="fa-stack">
																<i class="fa fa-square fa-stack-2x"></i>
																<i class="fa fa-search-plus fa-stack-1x fa-inverse"></i>
															</span>
														</a>
														<a href="#" class="table-link">
															<span class="fa-stack">
																<i class="fa fa-square fa-stack-2x"></i>
																<i class="fa fa-pencil fa-stack-1x fa-inverse"></i>
															</span>
														</a>
														<a href="#" class="table-link danger">
															<span class="fa-stack">
																<i class="fa fa-square fa-stack-2x"></i>
																<i class="fa fa-trash-o fa-stack-1x fa-inverse"></i>
															</span>
														</a>
													</td>
												</tr>
												<tr>
													<td>
														 MacBook Pro 15" Retina Core i7 2.7GHz
													</td>
													<td class="text-right">
														&dollar; 1.435.50
													</td>
													<td class="text-center">
														<span class="label label-success">Active</span>
													</td>
													<td class="text-center">
														2013/08/08 12:08
													</td>
													<td style="width: 15%;">
														<a href="#" class="table-link">
															<span class="fa-stack">
																<i class="fa fa-square fa-stack-2x"></i>
																<i class="fa fa-search-plus fa-stack-1x fa-inverse"></i>
															</span>
														</a>
														<a href="#" class="table-link">
															<span class="fa-stack">
																<i class="fa fa-square fa-stack-2x"></i>
																<i class="fa fa-pencil fa-stack-1x fa-inverse"></i>
															</span>
														</a>
														<a href="#" class="table-link danger">
															<span class="fa-stack">
																<i class="fa fa-square fa-stack-2x"></i>
																<i class="fa fa-trash-o fa-stack-1x fa-inverse"></i>
															</span>
														</a>
													</td>
												</tr>
											</tbody>
										</table>
									</div>
									<ul class="pagination pull-right">
										<li><a href="#"><i class="fa fa-chevron-left"></i></a></li>
										<li><a href="#">1</a></li>
										<li><a href="#">2</a></li>
										<li><a href="#">3</a></li>
										<li><a href="#">4</a></li>
										<li><a href="#">5</a></li>
										<li><a href="#"><i class="fa fa-chevron-right"></i></a></li>
									</ul>
								</div>
							</div>
						</div>
						
						<div class="row">
							<div class="col-lg-6">
								<div class="main-box clearfix">
									<h2>Users - hover on rows</h2>
									<div class="table-responsive">
										<table class="table table-striped table-hover">
											<thead>
												<tr>
													<th><span>User</span></th>
													<th><span>Role</span></th>
													<th class="text-center"><span>Status</span></th>
													<th class="text-center"><span>Created</span></th>
												</tr>
											</thead>
											<tbody>
												<tr>
													<td>
														Jack Nicholson
													</td>
													<td>
														Registered
													</td>
													<td class="text-center">
														<span class="label label-danger">Banned</span>
													</td>
													<td class="text-center">
														2013/08/08
													</td>
												</tr>
												<tr>
													<td>
														Humphrey Bogart
													</td>
													<td>
														Registered
													</td>
													<td class="text-center">
														<span class="label label-warning">Pending</span>
													</td>
													<td class="text-center">
														2013/08/08
													</td>
												</tr>
												<tr>
													<td>
														Angelina Jolie
													</td>
													<td>
														Admin
													</td>
													<td class="text-center">
														<span class="label label-default">Inactive</span>
													</td>
													<td class="text-center">
														2013/08/08
													</td>
												</tr>
												<tr>
													<td>
														Marlon Brando
													</td>
													<td>
														Member
													</td>
													<td class="text-center">
														<span class="label label-success">Active</span>
													</td>
													<td class="text-center">
														2013/08/08
													</td>
												</tr>
												<tr>
													<td>
														Kevin Spacey
													</td>
													<td>
														Admin
													</td>
													<td class="text-center">
														<span class="label label-success">Active</span>
													</td>
													<td class="text-center">
														2013/08/08
													</td>
												</tr>
											</tbody>
										</table>
									</div>
									<ul class="pagination pull-right">
										<li><a href="#"><i class="fa fa-chevron-left"></i></a></li>
										<li><a href="#">1</a></li>
										<li><a href="#">2</a></li>
										<li><a href="#">3</a></li>
										<li><a href="#">4</a></li>
										<li><a href="#">5</a></li>
										<li><a href="#"><i class="fa fa-chevron-right"></i></a></li>
									</ul>
								</div>
							</div>
							<div class="col-lg-6">
								<div class="main-box clearfix">
									<h2>New customers</h2>
									<br/>
									<div class="table-responsive">
										<table class="table table-products table-hover">
											<tbody>
												<tr>
													<td>
														<img src="img/samples/ipad.png" alt=""/>
													</td>
													<td>
														<span class="name">
														iPad mini 32GB WiFi Black&Slate
														</span>
														<span class="price">
															<i class="fa fa-money"></i> &dollar;320,00
														</span>
														<span class="warranty">
															<i class="fa fa-certificate"></i> Warranty: 2 years
														</span>
													</td>
												</tr>
												<tr>
													<td>
														<img src="img/samples/ipad.png" alt=""/>
													</td>
													<td>
														<span class="name">
														iPad mini 32GB WiFi Cellular Black&Slate
														</span>
														<span class="price">
															<i class="fa fa-money"></i> &dollar;447,29
														</span>
														<span class="warranty">
															<i class="fa fa-certificate"></i> Warranty: 4 years
														</span>
													</td>
												</tr>
												<tr>
													<td>
														<img src="img/samples/ipad.png" alt=""/>
													</td>
													<td>
														<span class="name">
														iPad mini 32GB WiFi Black&Slate
														</span>
														<span class="price">
															<i class="fa fa-money"></i> &dollar;320,00
														</span>
														<span class="warranty">
															<i class="fa fa-certificate"></i> Warranty: 2 years
														</span>
													</td>
												</tr>
											</tbody>
										</table>
									</div>
									<ul class="pagination pull-right">
										<li><a href="#"><i class="fa fa-chevron-left"></i></a></li>
										<li><a href="#">1</a></li>
										<li><a href="#">2</a></li>
										<li><a href="#">3</a></li>
										<li><a href="#">4</a></li>
										<li><a href="#">5</a></li>
										<li><a href="#"><i class="fa fa-chevron-right"></i></a></li>
									</ul>
								</div>
							</div>
						</div>
						
					</div>
				</div>
			</div>
		</div>
	</div>
	<footer id="footer-bar">
		<p id="footer-copyright">
			&copy; 2014 <a href="http://www.adbee.sk/" target="_blank">Adbee digital</a>. Powered by SuperheroAdmin.
		</p>
	</footer>
	
	<!-- global scripts -->
	<script src="js/jquery.js"></script>
	<script src="js/bootstrap.js"></script>
	
	<!-- this page specific scripts -->
	<script src="js/moment.min.js"></script>
	<script src="js/daterangepicker.js"></script>
	
	<!-- theme scripts -->
	<script src="js/scripts.js"></script>
	
	<!-- this page specific inline scripts -->
	<script type="text/javascript">
	$(document).ready(function() {
		$('#reportrange').daterangepicker({
			startDate: moment().subtract('days', 29),
			endDate: moment(),
			minDate: '01/01/2012',
			maxDate: '12/31/2014',
			dateLimit: { days: 60 },
			showDropdowns: true,
			showWeekNumbers: true,
			timePicker: false,
			timePickerIncrement: 1,
			timePicker12Hour: true,
			ranges: {
				'Today': [moment(), moment()],
				'Yesterday': [moment().subtract('days', 1), moment().subtract('days', 1)],
				'Last 7 Days': [moment().subtract('days', 6), moment()],
				'Last 30 Days': [moment().subtract('days', 29), moment()],
				'This Month': [moment().startOf('month'), moment().endOf('month')],
				'Last Month': [moment().subtract('month', 1).startOf('month'), moment().subtract('month', 1).endOf('month')]
			},
			opens: 'left',
			buttonClasses: ['btn btn-default'],
			applyClass: 'btn-small btn-primary',
			cancelClass: 'btn-small',
			format: 'MM/DD/YYYY',
			separator: ' to ',
			locale: {
				applyLabel: 'Submit',
				fromLabel: 'From',
				toLabel: 'To',
				customRangeLabel: 'Custom Range',
				daysOfWeek: ['Su', 'Mo', 'Tu', 'We', 'Th', 'Fr','Sa'],
				monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],
				firstDay: 1
			}
		 },
		 function(start, end) {
		  console.log("Callback has been called!");
		  $('#reportrange span').html(start.format('MMMM D, YYYY') + ' - ' + end.format('MMMM D, YYYY'));
		 }
	  );
	  //Set the initial state of the picker label
	  $('#reportrange span').html(moment().subtract('days', 29).format('MMMM D, YYYY') + ' - ' + moment().format('MMMM D, YYYY'));
	});
	</script>
</body>
</html>